<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>制作年历</title>
    <style>
        body{text-align:center;}
        .box{margin:0 auto;width:880px;}
        .title{background:aquamarine;}
        table{height:200px;width:200px;font-size:12px;text-align:center;float:left;margin:10px;font-family:arial;}
      </style>
</head>
<body>
    <script>
        var year = parseInt(prompt('输入年份：', '2018'));
        document.write(calendar(year));
      function calendar(y) {
        var w = new Date(y, 0).getDay();
    
        var html = '';
        for (var m = 1; m <= 12; ++m) {
            html += '<table>';
            html += '<tr class="title"><th colspan="7">' + y + ' 年 ' + m + ' 月</th></tr>';
            html += '<tr><td>日</td><td>一</td><td>二</td><td>三</td><td>四</td>';
            html +='<td>五</td><td>六</td></tr>'
            var max = new Date(y, m, 0).getDate();
            html += '<tr>';                        
            for (d = 1; d <= max; ++d) {
                if (w && d == 1) {                 
                    html += '<td colspan="' + w + '"> </td>';
                }
                html += '<td>' + d + '</td>';
                if (w == 6 && d != max) {           
                    html += '</tr><tr>';
                } else if (d == max) {               
                    html += '</tr>';
                }
                w = (w + 1 > 6) ? 0 : w + 1;
            }
            html +='</table>';
            }
        return html;}
            
        </script>
        
            <p><a href="第五章.html">返回上一级</a></p>
</body>
</html>